<!DOCTYPE html>
<html lang="en" style="height:100%">

<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>TA的主页</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../../css/style.css" />
    <link rel="stylesheet" type="text/css" href="../../css/yzl.css" />
    <link rel="stylesheet" type="text/css" href="../../css/vant.css" />
    <!-- <link rel="stylesheet" href="../../css/sqc.css"> -->
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        input{
            outline:none;
        }
        .active{
            border: 1px solid #F95656;
            background-color: #F95656;
            color: #fff;
        }
        .member_avatar{
          width: 12px;
          height: 12px;
          vertical-align: middle;
        }
        .personal .item-name-img .active_style{
            color: #999;
            border: 1px solid #999;
        }

        .pubu{
            width: 98%;
            margin: 0 auto;
        }
        .yg .yg_img{
            width:100%;
            border-radius: 6px 6px 0 0;
        }

        .pubu .yg {
            column-count:3;
        }
        .yg li{
            -moz-page-break-inside:avoid;
            -webkit-column-break-inside:avoid;
            break-inside:avoid;
            margin-bottom: 10px;
            background: #fff;
            border-radius: 8px;
            padding-bottom: 10px;
            box-shadow: 0 0 5px rgba(0,0,0,.1);
            border-radius: 6px 6px 6px 6px;
        }
    </style>
</head>

<body style="background: #f7f4f2;">
<div id="app"  v-cloak>

    <div style="padding-top: 60px;background-color: #fff;" class="others-homepage">
      <!-- <div class="ddd">
        <van-dropdown-menu>
            <van-dropdown-item v-model="value1" :options="option1" />
            <van-dropdown-item v-model="value2" :options="option2" />
          </van-dropdown-menu>
      </div> -->
        <div class="user-title header-title">
            <span style="position: relative;" v-back.tapmode>
                <img style="width: 8.5px;height: 16px;" v-src="'../../image/back_heise-1.png'" />
            </span>
            <div class="home-name" >
                <span class="personal-name">{{user_info.nickname}}</span>
            </div>
            <span >
                <img style="width: 19px;height: 19px;" v-src="'../../image/fenxiang.png'" />
            </span>
        </div>
        <div class="personal home-people" style="height: 172px;">
            <div class="portrait" v-open-win vurl="details">
                <img :src="user_info.member_avatar" />
            </div>
            <div class="item-name item-name-img" style="width: 70%;margin-bottom: 20px;">
                <div class="homepeople-number">
                    <div class="homepeople-number-title">
                        <div class="title-number" v-myclick="[user_info.member_id,openattent]">{{user_info.attent_number}}</div>
                        <div class="title-number" v-myclick="[user_info.member_id,openfans]">{{user_info.fans_number}}</div>
                        <div class="title-number">{{user_info.praise_and_collect_number}}</div>
                    </div>
                    <div class="homepeople-number-title">
                        <div class="title-number-two" v-myclick="[user_info.member_id,openattent]">关注</div>
                        <div class="title-number-two" v-myclick="[user_info.member_id,openfans]">粉丝</div>
                        <div class="title-number-two">获赞与收藏</div>
                    </div>
                </div>
                <div class="item-title" v-show="api.pageParam.target_id != getPrefs('member_id')" v-myclick="add_follow" :class="{active_style : user_info.attent_flag == 1}" style="width: 60%;">{{user_info.attent_flag==1?'已关注':'关注'}}</div>
                <div class="item-title" v-show="api.pageParam.target_id != getPrefs('member_id')" v-myclick="showPopup" style="width: 30%;color: #F95656;border: 1px solid #F95656;margin-left:12px;">赠礼</div>
                <div style="width: 100%;height: 30px;margin-top: 10px;float: left" v-show="api.pageParam.target_id == getPrefs('member_id')"></div>
            </div>
            <div class="particulars-item">
                <span class="particulars-line"></span>
                <img v-src="'../../image/nan.png'" />
                <span class="particulars-line"></span>
                <span>{{user_info.address}}</span>
                <span class="particulars-line"></span>
                <span>等级:&nbsp; <span style="color:#F95656;">{{user_info.member_grade}}</span></span>
                <span class="particulars-line"></span>
                <span>达人:&nbsp;<span style="color:#F95656;">{{user_info.member_talent_grade}}</span></span>
                <span class="particulars-line"></span>
                <span>礼物:&nbsp;<span style="color:#F95656;">{{user_info.gift_number}}</span></span>
                <span class="particulars-line"></span>
            </div>
            <div class="describe">{{user_info.member_signature}}</div>
        </div>
        <div>
            <van-tabs v-model="activeName">
                <van-tab :title="'动态('+user_info.dynamic_total_number+')'" name="a" class="dynamic">


                    <!--<div class="dynamic-card" v-for="(item, index) in user_info.dynamic_list">-->
                        <!--<img class="dynamic-card-img" :src="item.cover" v-myclick="[item,showdetail]"/>-->
                        <!--<div class="dynamic-card-content">-->
                            <!--<span class="dynamic-card-content-title">{{item.title}}</span>-->
                            <!--<div class="dynamic-name">-->
                                <!--<img style="width: 21px;height: 21px;border-radius: 50%;vertical-align: middle" :src="user_info.member_avatar" />-->
                                <!--<span style="font-size: 12px;color: #999;">{{user_info.nickname}}</span>-->
                                <!--<div style="float: right">-->
                                    <!--<img class="member_avatar"  v-myclick="[item,add_attent]" v-src="'../../image/huise-xin.png'" v-show="item.praise_flag==0">-->
                                    <!--<img class="member_avatar"  v-myclick="[item,add_attent]" v-src="'../../image/hongse-xin.png'" v-show="item.praise_flag==1">-->
                                    <!--<span style="vertical-align: middle;line-height: 20px;font-size: 12px;color: #999">{{item.praise_number}}</span>-->
                                <!--</div>-->
                            <!--</div>-->
                        <!--</div>-->
                    <!--</div>-->


                    <div class="pubu" >
                        <ul class="yg yg_l" style=" column-count:2;column-gap:5px;">
                            <li v-for="(item, index) in user_info.dynamic_list">
                                <div class="item_div">
                                    <img class="yg_img" :src="item.cover" alt="" v-myclick="[item,showdetail]">
                                    <div class="dynamic-card-cotent">
                                        <span class="dynamic-card-content-title">{{list.title}}</span>
                                        <div class="dynamic-name">
                                            <img style="width: 21px;border-radius: 50%;vertical-align: middle" :src="user_info.member_avatar" />
                                            <span style="font-size: 12px;color: #999;">{{user_info.nickname}}</span>
                                            <div style="float: right">
                                                <img class="member_avatar"  v-myclick="[item,add_attent]" v-src="'../../image/huise-xin.png'" v-show="item.praise_flag==0">
                                                <img class="member_avatar"  v-myclick="[item,add_attent]" v-src="'../../image/hongse-xin.png'" v-show="item.praise_flag==1">
                                                <span style="vertical-align: middle;line-height: 20px;font-size: 12px;color: #999">{{item.praise_number}}</span>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </li>
                        </ul>
                    </div>


                </van-tab>
                <van-tab :title="'收藏('+user_info.collect_total_number+')'" name="b" class="dynamic">

                  <!--<div class="dynamic-card" v-for="(item, index) in user_info.collect_list">-->
                      <!--<img class="dynamic-card-img" :src="item.cover" v-myclick="[item,showdetail]" />-->
                      <!--<div class="dynamic-card-content">-->
                          <!--<span class="dynamic-card-content-title">{{item.title}}</span>-->
                          <!--<div class="dynamic-name">-->
                              <!--<img style="width: 21px;height: 21px;border-radius: 50%;vertical-align: middle" :src="item.member_avatar" />-->
                              <!--<span style="font-size: 12px;color: #999;">{{item.nickname}}</span>-->
                              <!--<div style="float: right">-->
                                  <!--<img class="member_avatar" v-myclick="[item,add_attent]" v-src="'../../image/huise-xin.png'" v-show="item.praise_flag==0">-->
                                  <!--<img class="member_avatar" v-myclick="[item,add_attent]" v-src="'../../image/hongse-xin.png'" v-show="item.praise_flag==1">-->
                                  <!--<span style="vertical-align: middle;line-height: 20px;font-size: 12px;color: #999">{{item.praise_number}}</span>-->
                              <!--</div>-->
                          <!--</div>-->
                      <!--</div>-->
                  <!--</div>-->


                    <div class="pubu" >
                        <ul class="yg yg_l" style=" column-count:2;column-gap:5px;">
                            <li v-for="(item, index) in user_info.collect_list">
                                <div class="item_div">
                                    <img class="yg_img" :src="item.cover" alt="" v-myclick="[item,showdetail]">
                                    <div class="dynamic-card-cotent">
                                        <span class="dynamic-card-content-title">{{item.title}}</span>
                                        <div class="dynamic-name">
                                            <img style="width: 21px;border-radius: 50%;vertical-align: middle" :src="item.member_avatar" />
                                            <span style="font-size: 12px;color: #999;">{{item.nickname}}</span>
                                            <div style="float: right">
                                                <img class="member_avatar"  v-myclick="[item,add_attent]" v-src="'../../image/huise-xin.png'" v-show="item.praise_flag==0">
                                                <img class="member_avatar"  v-myclick="[item,add_attent]" v-src="'../../image/hongse-xin.png'" v-show="item.praise_flag==1">
                                                <span style="vertical-align: middle;line-height: 20px;font-size: 12px;color: #999">{{item.praise_number}}</span>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </li>
                        </ul>
                    </div>


                </van-tab>
            </van-tabs>
        </div>
        <van-popup
                v-model="show"
                closeable
                position="bottom"
                :style="{ height: '50%' }">
        <div class="diamond">
            <img class="frame-zuanshi" v-src="'../../image/zuanshi.png'"/>
            <span class="my-zuanshi">我的钻石:{{user_info.diamond_number}}</span>
        </div>
        <div class="heart-bg">
            <img src="../../image/big/aixin.png"/>
            <span>爱心</span>
        </div>
        <div class="setpper">
            <div class="setpper-item-top" v-for="(data, index) in list" :class="{active:index == addindex}" v-myclick="[index, setnumber]">{{data}}</div>
            <div class="custom">
                <input class="custom-inp" type="tel" placeholder="自定义" model="gift_count">
            </div>
        </div>
        <div class="diamond-bottom">
            <div class="diamond-bottom-left">
                <span class="songgei">送给</span>
                <img class="diamond-bottom-img" :src="user_info.member_avatar">
            </div>
            <div class="diamond-bottom-right">
                <span class="xiaohao">消耗钻石{{gift_count}}个</span>
                <span class="give" v-myclick="give_gift">赠送</span>
            </div>
        </div>
        </van-popup>
    </div>
</div>
</body>
<script src="../../script/api.js"></script>
<script src="../../script/vue.js"></script>
<script src="../../script/app.js"></script>
<script src="../../script/common.js"></script>
<script src="../../script/url.js"></script>
<script src="../../script/components.js"></script>
<script type="text/javascript" src="../../script/jquery.js"></script>
<script type="text/javascript" src="../../script/vant.min.js"></script>

<script>
    var vm,
    user_info;
    apiready = function () {
        setBSImg();
        new Vue({
            el: '#blank'
        })
        wx = api.require('wx');
        var data = {
            browse_member_id: getPrefs('member_id'),
            other_member_id: api.pageParam.target_id,
        };
        var callback = function (ret) {
          user_info = ret.content;
          console.log(JSON.stringify(user_info))
          initApp();
        };
        pinet.post(APIURL+'/app/dynamic/otherHome', data, callback);
        api.parseTapmode();
    };

    function initApp() {
        // var isBigImg = Vue.BSImg == 'big';
        vm = new Vue({
            el: '#app',
            data: {
                activeName: 'a',
                show: false,
                value: 1,
                list:[1,20,66,99],
                gift_count:1,
                addindex:-1,
                user_info:user_info

            },
            computed: {

            },
            methods: {
                setnumber:function(index){
                    this.addindex = index;
                    this.gift_count = this.list[index]
                },
                give_gift:function(){
                  var data = {
                      send_member_id: getPrefs('member_id'),
                      receive_member_id: api.pageParam.target_id,
                      gift_number:this.gift_count,
                      return_flag:0
                  };
                  var callback = function (ret) {
                    api.toast({
                        msg: ret.message,
                        duration: 2000,
                        location: 'middle'
                    });
                    vm.reload_info();
                    vm.show = !vm.show;
                  };
                  pinet.post(APIURL+'/app/dynamic/sendGift', data, callback);
                },
                reload_info:function(){
                  var data = {
                      browse_member_id: getPrefs('member_id'),
                      other_member_id: api.pageParam.target_id,
                  };
                  var callback = function (ret) {
                    vm.user_info = ret.content;
                  };
                  pinet.post(APIURL+'/app/dynamic/otherHome', data, callback);
                },
                add_follow:function(value){
                    if(!hasPrefs('token')){
                        api.toast({
                            msg: '请登录',
                            duration: 2000,
                            location: 'middle'
                        });
                        return;
                    }
                  var data = {
                      member_id: getPrefs('member_id'),
                      attention_member_id: api.pageParam.target_id,
                  };
                  var callback = function (ret) {
                    api.toast({
                        msg: ret.message,
                        duration: 2000,
                        location: 'middle'
                    });
                      vm.user_info.attent_flag = vm.user_info.attent_flag==1?0:1
                  };
                  pinet.post(APIURL+'/app/dynamic/attention', data, callback);
                },
                add_attent:function(item){
                  var data = {
                      member_id: getPrefs('member_id'),
                      dynamic_id: item.id,
                  };
                  var callback = function (ret) {
                    api.toast({
                        msg: ret.message,
                        duration: 2000,
                        location: 'middle'
                    });
                    vm.reload_info();
                  };
                  pinet.post(APIURL+'/app/dynamic/dynamicPraiseSet', data, callback);
                },
                showdetail:function(item){
                  api.openWin({
                      name: 'details',
                      url: './details.html',
                      pageParam: {
                          id: item.id
                      }
                  });

                },
                openattent:function(member_id){
                  api.openWin({
                      name: 'hisconcern',
                      url: './hisconcern.html',
                      pageParam: {
                          target_id: member_id
                      }
                  });

                },
                openfans:function(member_id){
                  api.openWin({
                      name: 'hisfans',
                      url: './hisfans.html',
                      pageParam: {
                          target_id: member_id
                      }
                  });

                },
                showPopup:function(){
                    if(!hasPrefs('token')){
                        api.toast({
                            msg: '请登录',
                            duration: 2000,
                            location: 'middle'
                        });
                        return;
                    }
                    this.show = true;
                },
                blacklists:function(){
                    api.openWin({
                        name: 'blacklist',
                        url: './blacklist.html'
                    });
                },
                edit:function(){
                    api.openWin({
                        name: 'means',
                        url: './means.html'
                    });
                },
                namezhen:function(){
                    api.openWin({
                        name: 'realname',
                        url: './realname.html'
                    });
                },
                set:function(){
                    api.openWin({
                        name: 'setup',
                        url: './setup.html'
                    });
                },
                exp:function(){
                    api.openWin({
                        name: 'empiricalvalue',
                        url: './empiricalvalue.html'
                    });

                },
                deletephone:function(){
                    this.phone=''
                },
                forget:function(){
                    api.openWin({
                        name: 'page1',
                        url: './pwdforget.html',
                        pageParam: {
                            name: 'test'
                        }
                    });

                },
                codesing:function(){
                    api.openWin({
                        name: 'codelogin',
                        url: './codelogin.html'
                    });
                },
                register:function(){
                    api.openWin({
                        name: 'register',
                        url: './setInfo.html'
                    });
                },
            },
            watch: {
            },
        })
    }
</script>

</html>
